<!--
 * @Author: coman
 * @LastEditors: coman
 * @Date: 2020-06-19 17:44:01
 * @motto: No pain,No gain
 * @LastEditTime: 2020-06-19 19:56:53
--> 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            background: #c3c3c3;
        }
       
        div span{
            font-size: 20px;
            font-weight: bold;
            color: #333333;
            margin: 0 20px;
           height: 40px;
          
          
        }
    </style>
</head>
<body>
    <div>
        <img src="../img/0.png" alt="" id="hour1">
        <img src="../img/0.png" alt="" id="hour2"><span>:</span>
        <img src="../img/0.png" alt="" id="min1">
        <img src="../img/0.png" alt="" id="min2"><span>:</span>
        <img src="../img/0.png" alt="" id="sec1">
        <img src="../img/0.png" alt="" id="sec2">
        
    </div>
    <script src="../js/Date.js"></script>
    <script >
        // 开始时间
        var start_date=new Date();
       // 时间差
       
 function swap_photo(hour,min,sec) {
   
        //小于10只显示个位数的数字
        if(hour<10){
            hour1.src="../img/0.png";
            hour2.src = "../img/"+(parseInt(hour%10))+".png";
        }
        if(hour>=10){
            hour1.src = "../img/"+(parseInt(hour/10))+".png";
            hour2.src = "../img/"+(parseInt(hour%10))+".png";
        }
       
        if(min<10){
            min1.src="../img/0.png";
            min2.src = "../img/"+(parseInt(min%10))+".png";
        }
        if(min>=10){
            min1.src = "../img/"+(parseInt(min/10))+".png";
            min2.src = "../img/"+(parseInt(min%10))+".png";
        }
        if(min<10){
            sec1.src="../img/0.png";
            sec2.src="../img/"+(parseInt(second%10))+".png";
        }
        if(second>=10){
            sec1.src = "../img/"+(parseInt(second/10))+".png";
            sec2.src = "../img/"+(parseInt(second%10))+".png";
        }
       
}
        // 当前时间
        setInterval(function(){
            // 当前时间
            var current_time=new Date();
           var oDate = time_dif(start_date,current_time);
           var hour =oDate.hour;
           var sec = oDate.sec;
           var min = oDate.min;
           swap_photo(hour,min,sec);
        },1000)
       
        
    </script>
</body>
</html>